﻿<!--
// (c) Copyright Microsoft Corporation.
// This source is subject to the Microsoft Public License (Ms-PL).
// Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
// All other rights reserved.
-->

<UserControl
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls"
  xmlns:controlsToolkit="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit"
  xmlns:visualizationToolkit="clr-namespace:System.Windows.Controls.DataVisualization;assembly=System.Windows.Controls.DataVisualization.Toolkit"
  xmlns:chartingToolkit="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit"
  x:Class="System.Windows.Controls.Samples.ColumnAnimationSample">
    <StackPanel>
        <StackPanel.Resources>
            <Style x:Key="ChartStyle" TargetType="chartingToolkit:Chart">
                <Setter Property="Background" Value="Transparent"/>
            </Style>
        </StackPanel.Resources>

        <!-- Default -->
        <ContentControl Content="Default (Click chart to clear/reset series data)" Style="{StaticResource Header}"/>

        <controlsToolkit:WrapPanel>

            <Grid Style="{StaticResource WrapperStyle}">
                <chartingToolkit:Chart Title="AnimationSequence = [Default]" Style="{StaticResource ChartStyle}" MouseLeftButtonDown="OnMouseLeftButtonDown">
                    <chartingToolkit:Chart.Series>
                        <chartingToolkit:ColumnSeries Title="Popularity" ItemsSource="{StaticResource GizmoPopularity}" DependentValueBinding="{Binding Percent}"/>
                    </chartingToolkit:Chart.Series>
                </chartingToolkit:Chart>
            </Grid>

            <Grid Style="{StaticResource WrapperStyle}">
                <chartingToolkit:Chart Title="AnimationSequence = Simultaneous" Style="{StaticResource ChartStyle}" MouseLeftButtonDown="OnMouseLeftButtonDown">
                    <chartingToolkit:Chart.Series>
                        <chartingToolkit:ColumnSeries Title="Popularity" ItemsSource="{StaticResource GizmoPopularity}" DependentValueBinding="{Binding Percent}" AnimationSequence="Simultaneous"/>
                    </chartingToolkit:Chart.Series>
                </chartingToolkit:Chart>
            </Grid>

            <Grid Style="{StaticResource WrapperStyle}">
                <chartingToolkit:Chart Title="AnimationSequence = FirstToLast" Style="{StaticResource ChartStyle}" MouseLeftButtonDown="OnMouseLeftButtonDown">
                    <chartingToolkit:Chart.Series>
                        <chartingToolkit:ColumnSeries Title="Popularity" ItemsSource="{StaticResource GizmoPopularity}" DependentValueBinding="{Binding Percent}" AnimationSequence="FirstToLast"/>
                    </chartingToolkit:Chart.Series>
                </chartingToolkit:Chart>
            </Grid>

            <Grid Style="{StaticResource WrapperStyle}">
                <chartingToolkit:Chart Title="AnimationSequence = LastToFirst" Style="{StaticResource ChartStyle}" MouseLeftButtonDown="OnMouseLeftButtonDown">
                    <chartingToolkit:Chart.Series>
                        <chartingToolkit:ColumnSeries Title="Popularity" ItemsSource="{StaticResource GizmoPopularity}" DependentValueBinding="{Binding Percent}" AnimationSequence="LastToFirst"/>
                    </chartingToolkit:Chart.Series>
                </chartingToolkit:Chart>
            </Grid>

        </controlsToolkit:WrapPanel>

        <!-- Custom (Grow) -->
        <ContentControl Content="Custom: Grow (Click chart to clear/reset series data)" Style="{StaticResource Header}"/>

        <controlsToolkit:WrapPanel>
            <controlsToolkit:WrapPanel.Resources>
                <ControlTemplate x:Key="GrowDataPoint" TargetType="chartingToolkit:DataPoint">
                    <Border
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        RenderTransformOrigin="0,1">
                        <Border.RenderTransform>
                            <ScaleTransform x:Name="Scale" ScaleY="0"/>
                        </Border.RenderTransform>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="RevealStates">
                                <VisualStateGroup.Transitions>
                                    <VisualTransition GeneratedDuration="0:0:0.5"/>
                                </VisualStateGroup.Transitions>
                                <VisualState x:Name="Shown">
                                    <Storyboard>
                                        <DoubleAnimation
                                            Storyboard.TargetName="Scale"
                                            Storyboard.TargetProperty="ScaleY"
                                            To="1"
                                            Duration="0"/>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Hidden">
                                    <Storyboard>
                                        <DoubleAnimation
                                            Storyboard.TargetName="Scale"
                                            Storyboard.TargetProperty="ScaleY"
                                            To="0"
                                            Duration="0"/>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Grid
                            Background="{TemplateBinding Background}">
                            <Rectangle>
                                <Rectangle.Fill>
                                    <LinearGradientBrush>
                                        <GradientStop
                                            Color="#77ffffff"
                                            Offset="0"/>
                                        <GradientStop
                                            Color="#00ffffff"
                                            Offset="1"/>
                                    </LinearGradientBrush>
                                </Rectangle.Fill>
                            </Rectangle>
                            <Border
                                BorderBrush="#ccffffff"
                                BorderThickness="1">
                                <Border
                                    BorderBrush="#77ffffff"
                                    BorderThickness="1"/>
                            </Border>
                        </Grid>
                        <ToolTipService.ToolTip>
                            <ContentControl Content="{TemplateBinding DependentValue}"/>
                        </ToolTipService.ToolTip>
                    </Border>
                </ControlTemplate>

                <visualizationToolkit:StylePalette x:Key="GrowDataPointPalette">
                    <Style TargetType="chartingToolkit:DataPoint">
                        <Setter Property="Template" Value="{StaticResource GrowDataPoint}"/>
                    </Style>
                </visualizationToolkit:StylePalette>
            </controlsToolkit:WrapPanel.Resources>

            <Grid Style="{StaticResource WrapperStyle}">
                <chartingToolkit:Chart Title="AnimationSequence = Simultaneous" StylePalette="{StaticResource GrowDataPointPalette}" Style="{StaticResource ChartStyle}" MouseLeftButtonDown="OnMouseLeftButtonDown">
                    <chartingToolkit:Chart.Series>
                        <chartingToolkit:ColumnSeries Title="Popularity" ItemsSource="{StaticResource GizmoPopularity}" DependentValueBinding="{Binding Percent}" AnimationSequence="Simultaneous"/>
                    </chartingToolkit:Chart.Series>
                </chartingToolkit:Chart>
            </Grid>

            <Grid Style="{StaticResource WrapperStyle}">
                <chartingToolkit:Chart Title="AnimationSequence = FirstToLast" StylePalette="{StaticResource GrowDataPointPalette}" Style="{StaticResource ChartStyle}" MouseLeftButtonDown="OnMouseLeftButtonDown">
                    <chartingToolkit:Chart.Series>
                        <chartingToolkit:ColumnSeries Title="Popularity" ItemsSource="{StaticResource GizmoPopularity}" DependentValueBinding="{Binding Percent}" AnimationSequence="FirstToLast"/>
                    </chartingToolkit:Chart.Series>
                </chartingToolkit:Chart>
            </Grid>

            <Grid Style="{StaticResource WrapperStyle}">
                <chartingToolkit:Chart Title="AnimationSequence = LastToFirst" StylePalette="{StaticResource GrowDataPointPalette}" Style="{StaticResource ChartStyle}" MouseLeftButtonDown="OnMouseLeftButtonDown">
                    <chartingToolkit:Chart.Series>
                        <chartingToolkit:ColumnSeries Title="Popularity" ItemsSource="{StaticResource GizmoPopularity}" DependentValueBinding="{Binding Percent}" AnimationSequence="LastToFirst"/>
                    </chartingToolkit:Chart.Series>
                </chartingToolkit:Chart>
            </Grid>
        </controlsToolkit:WrapPanel>
        <src:SourceViewer xmlns:src="clr-namespace:System.Windows.Controls.Samples;assembly=System.Windows.Controls.Samples.Common" xmlns:sys="clr-namespace:System;assembly=mscorlib">
  <src:SourceFile Path="ColumnAnimationSample.xaml">
    <src:SourceFile.Source>
      <sys:String>&lt;!--
// (c) Copyright Microsoft Corporation.
// This source is subject to the Microsoft Public License (Ms-PL).
// Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
// All other rights reserved.
--&gt;

&lt;UserControl
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls"
  xmlns:controlsToolkit="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit"
  xmlns:visualizationToolkit="clr-namespace:System.Windows.Controls.DataVisualization;assembly=System.Windows.Controls.DataVisualization.Toolkit"
  xmlns:chartingToolkit="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit"
  x:Class="System.Windows.Controls.Samples.ColumnAnimationSample"&gt;
    &lt;StackPanel&gt;
        &lt;StackPanel.Resources&gt;
            &lt;Style x:Key="ChartStyle" TargetType="chartingToolkit:Chart"&gt;
                &lt;Setter Property="Background" Value="Transparent"/&gt;
            &lt;/Style&gt;
        &lt;/StackPanel.Resources&gt;

        &lt;!-- Default --&gt;
        &lt;ContentControl Content="Default (Click chart to clear/reset series data)" Style="{StaticResource Header}"/&gt;

        &lt;controlsToolkit:WrapPanel&gt;

            &lt;Grid Style="{StaticResource WrapperStyle}"&gt;
                &lt;chartingToolkit:Chart Title="AnimationSequence = [Default]" Style="{StaticResource ChartStyle}" MouseLeftButtonDown="OnMouseLeftButtonDown"&gt;
                    &lt;chartingToolkit:Chart.Series&gt;
                        &lt;chartingToolkit:ColumnSeries Title="Popularity" ItemsSource="{StaticResource GizmoPopularity}" DependentValueBinding="{Binding Percent}"/&gt;
                    &lt;/chartingToolkit:Chart.Series&gt;
                &lt;/chartingToolkit:Chart&gt;
            &lt;/Grid&gt;

            &lt;Grid Style="{StaticResource WrapperStyle}"&gt;
                &lt;chartingToolkit:Chart Title="AnimationSequence = Simultaneous" Style="{StaticResource ChartStyle}" MouseLeftButtonDown="OnMouseLeftButtonDown"&gt;
                    &lt;chartingToolkit:Chart.Series&gt;
                        &lt;chartingToolkit:ColumnSeries Title="Popularity" ItemsSource="{StaticResource GizmoPopularity}" DependentValueBinding="{Binding Percent}" AnimationSequence="Simultaneous"/&gt;
                    &lt;/chartingToolkit:Chart.Series&gt;
                &lt;/chartingToolkit:Chart&gt;
            &lt;/Grid&gt;

            &lt;Grid Style="{StaticResource WrapperStyle}"&gt;
                &lt;chartingToolkit:Chart Title="AnimationSequence = FirstToLast" Style="{StaticResource ChartStyle}" MouseLeftButtonDown="OnMouseLeftButtonDown"&gt;
                    &lt;chartingToolkit:Chart.Series&gt;
                        &lt;chartingToolkit:ColumnSeries Title="Popularity" ItemsSource="{StaticResource GizmoPopularity}" DependentValueBinding="{Binding Percent}" AnimationSequence="FirstToLast"/&gt;
                    &lt;/chartingToolkit:Chart.Series&gt;
                &lt;/chartingToolkit:Chart&gt;
            &lt;/Grid&gt;

            &lt;Grid Style="{StaticResource WrapperStyle}"&gt;
                &lt;chartingToolkit:Chart Title="AnimationSequence = LastToFirst" Style="{StaticResource ChartStyle}" MouseLeftButtonDown="OnMouseLeftButtonDown"&gt;
                    &lt;chartingToolkit:Chart.Series&gt;
                        &lt;chartingToolkit:ColumnSeries Title="Popularity" ItemsSource="{StaticResource GizmoPopularity}" DependentValueBinding="{Binding Percent}" AnimationSequence="LastToFirst"/&gt;
                    &lt;/chartingToolkit:Chart.Series&gt;
                &lt;/chartingToolkit:Chart&gt;
            &lt;/Grid&gt;

        &lt;/controlsToolkit:WrapPanel&gt;

        &lt;!-- Custom (Grow) --&gt;
        &lt;ContentControl Content="Custom: Grow (Click chart to clear/reset series data)" Style="{StaticResource Header}"/&gt;

        &lt;controlsToolkit:WrapPanel&gt;
            &lt;controlsToolkit:WrapPanel.Resources&gt;
                &lt;ControlTemplate x:Key="GrowDataPoint" TargetType="chartingToolkit:DataPoint"&gt;
                    &lt;Border
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        RenderTransformOrigin="0,1"&gt;
                        &lt;Border.RenderTransform&gt;
                            &lt;ScaleTransform x:Name="Scale" ScaleY="0"/&gt;
                        &lt;/Border.RenderTransform&gt;
                        &lt;VisualStateManager.VisualStateGroups&gt;
                            &lt;VisualStateGroup x:Name="RevealStates"&gt;
                                &lt;VisualStateGroup.Transitions&gt;
                                    &lt;VisualTransition GeneratedDuration="0:0:0.5"/&gt;
                                &lt;/VisualStateGroup.Transitions&gt;
                                &lt;VisualState x:Name="Shown"&gt;
                                    &lt;Storyboard&gt;
                                        &lt;DoubleAnimation
                                            Storyboard.TargetName="Scale"
                                            Storyboard.TargetProperty="ScaleY"
                                            To="1"
                                            Duration="0"/&gt;
                                    &lt;/Storyboard&gt;
                                &lt;/VisualState&gt;
                                &lt;VisualState x:Name="Hidden"&gt;
                                    &lt;Storyboard&gt;
                                        &lt;DoubleAnimation
                                            Storyboard.TargetName="Scale"
                                            Storyboard.TargetProperty="ScaleY"
                                            To="0"
                                            Duration="0"/&gt;
                                    &lt;/Storyboard&gt;
                                &lt;/VisualState&gt;
                            &lt;/VisualStateGroup&gt;
                        &lt;/VisualStateManager.VisualStateGroups&gt;
                        &lt;Grid
                            Background="{TemplateBinding Background}"&gt;
                            &lt;Rectangle&gt;
                                &lt;Rectangle.Fill&gt;
                                    &lt;LinearGradientBrush&gt;
                                        &lt;GradientStop
                                            Color="#77ffffff"
                                            Offset="0"/&gt;
                                        &lt;GradientStop
                                            Color="#00ffffff"
                                            Offset="1"/&gt;
                                    &lt;/LinearGradientBrush&gt;
                                &lt;/Rectangle.Fill&gt;
                            &lt;/Rectangle&gt;
                            &lt;Border
                                BorderBrush="#ccffffff"
                                BorderThickness="1"&gt;
                                &lt;Border
                                    BorderBrush="#77ffffff"
                                    BorderThickness="1"/&gt;
                            &lt;/Border&gt;
                        &lt;/Grid&gt;
                        &lt;ToolTipService.ToolTip&gt;
                            &lt;ContentControl Content="{TemplateBinding DependentValue}"/&gt;
                        &lt;/ToolTipService.ToolTip&gt;
                    &lt;/Border&gt;
                &lt;/ControlTemplate&gt;

                &lt;visualizationToolkit:StylePalette x:Key="GrowDataPointPalette"&gt;
                    &lt;Style TargetType="chartingToolkit:DataPoint"&gt;
                        &lt;Setter Property="Template" Value="{StaticResource GrowDataPoint}"/&gt;
                    &lt;/Style&gt;
                &lt;/visualizationToolkit:StylePalette&gt;
            &lt;/controlsToolkit:WrapPanel.Resources&gt;

            &lt;Grid Style="{StaticResource WrapperStyle}"&gt;
                &lt;chartingToolkit:Chart Title="AnimationSequence = Simultaneous" StylePalette="{StaticResource GrowDataPointPalette}" Style="{StaticResource ChartStyle}" MouseLeftButtonDown="OnMouseLeftButtonDown"&gt;
                    &lt;chartingToolkit:Chart.Series&gt;
                        &lt;chartingToolkit:ColumnSeries Title="Popularity" ItemsSource="{StaticResource GizmoPopularity}" DependentValueBinding="{Binding Percent}" AnimationSequence="Simultaneous"/&gt;
                    &lt;/chartingToolkit:Chart.Series&gt;
                &lt;/chartingToolkit:Chart&gt;
            &lt;/Grid&gt;

            &lt;Grid Style="{StaticResource WrapperStyle}"&gt;
                &lt;chartingToolkit:Chart Title="AnimationSequence = FirstToLast" StylePalette="{StaticResource GrowDataPointPalette}" Style="{StaticResource ChartStyle}" MouseLeftButtonDown="OnMouseLeftButtonDown"&gt;
                    &lt;chartingToolkit:Chart.Series&gt;
                        &lt;chartingToolkit:ColumnSeries Title="Popularity" ItemsSource="{StaticResource GizmoPopularity}" DependentValueBinding="{Binding Percent}" AnimationSequence="FirstToLast"/&gt;
                    &lt;/chartingToolkit:Chart.Series&gt;
                &lt;/chartingToolkit:Chart&gt;
            &lt;/Grid&gt;

            &lt;Grid Style="{StaticResource WrapperStyle}"&gt;
                &lt;chartingToolkit:Chart Title="AnimationSequence = LastToFirst" StylePalette="{StaticResource GrowDataPointPalette}" Style="{StaticResource ChartStyle}" MouseLeftButtonDown="OnMouseLeftButtonDown"&gt;
                    &lt;chartingToolkit:Chart.Series&gt;
                        &lt;chartingToolkit:ColumnSeries Title="Popularity" ItemsSource="{StaticResource GizmoPopularity}" DependentValueBinding="{Binding Percent}" AnimationSequence="LastToFirst"/&gt;
                    &lt;/chartingToolkit:Chart.Series&gt;
                &lt;/chartingToolkit:Chart&gt;
            &lt;/Grid&gt;
        &lt;/controlsToolkit:WrapPanel&gt;
    &lt;/StackPanel&gt;
&lt;/UserControl&gt;</sys:String>
    </src:SourceFile.Source>
  </src:SourceFile>
  <src:SourceFile Path="ColumnAnimationSample.xaml.cs">
    <src:SourceFile.Source>
      <sys:String>// (c) Copyright Microsoft Corporation.
// This source is subject to the Microsoft Public License (Ms-PL).
// Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
// All other rights reserved.

using System.Windows.Controls;
using System.Windows.Input;
using System.Windows.Controls.DataVisualization.Charting;
using System.Collections;
using System.ComponentModel;

namespace System.Windows.Controls.Samples
{
    /// &lt;summary&gt;
    /// Sample page demonstrating Animations.
    /// &lt;/summary&gt;
    [Sample("(2)Animation", DifficultyLevel.Advanced)]
    [Category("Column Series")]
    public partial class ColumnAnimationSample : UserControl
    {
        /// &lt;summary&gt;
        /// Initializes a new instance of the AnimationSample class.
        /// &lt;/summary&gt;
        public ColumnAnimationSample()
        {
            InitializeComponent();
        }

        /// &lt;summary&gt;
        /// Called when the Chart is clicked.
        /// &lt;/summary&gt;
        /// &lt;param name="sender"&gt;The object that raised the event.&lt;/param&gt;
        /// &lt;param name="e"&gt;Information about the event.&lt;/param&gt;
        [System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Performance", "CA1811:AvoidUncalledPrivateCode", Justification = "Attached to event handler in XAML.")]
        private void OnMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            Chart chart = sender as Chart;

            if (null != chart)
            {
                // Toggle each Series ItemsSource so the reveal/hide animations can be seen
                foreach (DataPointSeries series in chart.Series)
                {
                    if (null == series.Tag)
                    {
                        series.Tag = series.ItemsSource;
                        series.ItemsSource = null;
                    }
                    else
                    {
                        series.ItemsSource = series.Tag as IEnumerable;
                        series.Tag = null;
                    }
                }
            }
        }
    }
}
</sys:String>
    </src:SourceFile.Source>
  </src:SourceFile>
  <src:SourceFile Path="ColumnAnimationSample.xaml.vb">
    <src:SourceFile.Source>
      <sys:String>' (c) Copyright Microsoft Corporation.
' This source is subject to the Microsoft Public License (Ms-PL).
' Please see http://go.microsoft.com/fwlink/?LinkID=131993 for details.
' All other rights reserved.

Imports Microsoft.VisualBasic
Imports System.Windows.Controls
Imports System.Windows.Input
Imports System.Windows.Controls.DataVisualization.Charting
Imports System.Collections
Imports System.ComponentModel

''' &lt;summary&gt;
''' Sample page demonstrating Animations.
''' &lt;/summary&gt;
&lt;Sample("(2)Animation", DifficultyLevel.Advanced), Category("Column Series")&gt; _
Partial Public Class ColumnAnimationSample
    Inherits UserControl
    ''' &lt;summary&gt;
    ''' Initializes a new instance of the AnimationSample class.
    ''' &lt;/summary&gt;
    Public Sub New()
        InitializeComponent()
    End Sub

    ''' &lt;summary&gt;
    ''' Called when the Chart is clicked.
    ''' &lt;/summary&gt;
    ''' &lt;param name="sender"&gt;The object that raised the event.&lt;/param&gt;
    ''' &lt;param name="e"&gt;Information about the event.&lt;/param&gt;
    &lt;System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Performance", "CA1811:AvoidUncalledPrivateCode", Justification:="Attached to event handler in XAML.")&gt; _
    Private Overloads Sub OnMouseLeftButtonDown(ByVal sender As Object, ByVal e As MouseButtonEventArgs)
        Dim chart As Chart = TryCast(sender, Chart)

        If Nothing IsNot chart Then
            ' Toggle each Series ItemsSource so the reveal/hide animations can be seen
            For Each series As DataPointSeries In chart.Series
                If Nothing Is series.Tag Then
                    series.Tag = series.ItemsSource
                    series.ItemsSource = Nothing
                Else
                    series.ItemsSource = TryCast(series.Tag, IEnumerable)
                    series.Tag = Nothing
                End If
            Next series
        End If
    End Sub
End Class

</sys:String>
    </src:SourceFile.Source>
  </src:SourceFile>
</src:SourceViewer>
    </StackPanel>
</UserControl>